<template>
	<view class="container">
		<!-- 页面头部 -->
		<view class="header">
			<view class="title">考试系统调试</view>
			<view class="subtitle">用于测试和调试考试功能</view>
		</view>
		
		<!-- 调试功能区 -->
		<view class="debug-section">
			<view class="debug-card">
				<view class="card-title">试卷加载测试</view>
				<view class="form-item">
					<text class="form-label">试卷ID</text>
					<input class="form-input" type="text" v-model="examId" placeholder="请输入试卷ID" />
				</view>
				<button class="debug-btn" @click="loadExam">加载试卷</button>
			</view>
			
			<view class="debug-card" v-if="examLoaded">
				<view class="card-title">试卷信息</view>
				<view class="info-item">
					<text class="info-label">标题：</text>
					<text class="info-value">{{examInfo.title}}</text>
				</view>
				<view class="info-item">
					<text class="info-label">题目数量：</text>
					<text class="info-value">{{examInfo.question_count || '未知'}}</text>
				</view>
				<view class="info-item">
					<text class="info-label">总分：</text>
					<text class="info-value">{{examInfo.total_score || '未知'}}</text>
				</view>
				<view class="info-item">
					<text class="info-label">及格分数：</text>
					<text class="info-value">{{examInfo.pass_score || '未知'}}</text>
				</view>
				<view class="info-item">
					<text class="info-label">考试时长：</text>
					<text class="info-value">{{examInfo.time_limit || '未知'}}分钟</text>
				</view>
				
				<button class="debug-btn" @click="startExam">开始考试调试</button>
			</view>
			
			<view class="debug-card">
				<view class="card-title">其他调试功能</view>
				<button class="debug-btn" @click="testCloudFunction">测试云函数</button>
				<button class="debug-btn" @click="clearExamCache">清除考试缓存</button>
				<button class="debug-btn" @click="navigateToExamPage">跳转到考试页面</button>
				<button class="debug-btn" @click="navigateToExamResult">跳转到结果页面</button>
			</view>
			
			<!-- 日志输出区 -->
			<view class="debug-logs">
				<view class="card-title">调试日志</view>
				<scroll-view scroll-y class="log-container">
					<text class="log-item" v-for="(log, index) in logs" :key="index">{{log}}</text>
				</scroll-view>
				<button class="debug-btn clear-log-btn" @click="clearLogs">清除日志</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				examId: '',
				examLoaded: false,
				examInfo: {},
				logs: [] // 调试日志
			}
		},
		onLoad(options) {
			this.addLog('页面加载完成');
			// 如果有参数，则自动加载
			if (options.id) {
				this.examId = options.id;
				this.loadExam();
			}
		},
		methods: {
			// 加载试卷
			loadExam() {
				if (!this.examId) {
					this.addLog('错误：请输入试卷ID');
					return;
				}
				
				this.addLog(`正在加载试卷: ${this.examId}`);
				uni.showLoading({
					title: '加载中...'
				});
				
				// 调用云对象获取试卷
				(async () => {
					try {
						const examService = uniCloud.importObject('exam-service');
						const res = await examService.getExamPaper({
						examId: this.examId
						});
						
						uni.hideLoading();
						if (res.code === 0) {
							this.examInfo = res.data;
							this.examLoaded = true;
							this.addLog(`试卷加载成功: ${this.examInfo.title}`);
						} else {
							this.addLog(`试卷加载失败: ${res.message || '未知错误'}`);
							// 使用模拟数据
							this.loadMockExam();
						}
					} catch (err) {
						uni.hideLoading();
						this.addLog(`调用云对象失败: ${err.message || JSON.stringify(err)}`);
						// 使用模拟数据
						this.loadMockExam();
					}
				})();
			},
			
			// 加载模拟试卷数据
			loadMockExam() {
				this.addLog('加载模拟试卷数据');
				this.examInfo = {
					_id: this.examId || 'mock_exam_001',
					title: '模拟测试试卷',
					description: '这是一个用于测试的模拟试卷',
					time_limit: 30,
					question_count: 10,
					total_score: 100,
					pass_score: 60,
					questions: Array(10).fill().map((_, i) => ({
						_id: `q_${i}`,
						title: `测试题目 ${i+1}`,
						type: i % 3 === 0 ? 'single' : i % 3 === 1 ? 'multiple' : 'judge',
						options: i % 3 === 2 ? [] : Array(4).fill().map((_, j) => ({
							content: `选项 ${String.fromCharCode(65 + j)}`
						})),
						correct_option: i % 3 === 0 ? 0 : i % 3 === 2 ? true : null,
						correct_options: i % 3 === 1 ? [0, 1] : [],
						score: 10,
						explanation: `这是题目 ${i+1} 的解析`
					}))
				};
				this.examLoaded = true;
			},
			
			// 开始考试调试
			startExam() {
				if (!this.examLoaded) {
					this.addLog('错误：请先加载试卷');
					return;
				}
				
				this.addLog(`开始调试考试: ${this.examInfo.title}`);
				
				// 将试卷信息存储到本地缓存
				try {
					uni.setStorageSync('debug_exam_paper', JSON.stringify(this.examInfo));
					uni.navigateTo({
						url: './exam-page?mode=debug&id=' + this.examInfo._id,
						success: () => {
							this.addLog('已跳转到考试页面');
						},
						fail: (err) => {
							this.addLog(`跳转失败: ${err.message || JSON.stringify(err)}`);
						}
					});
				} catch (e) {
					this.addLog(`存储试卷信息失败: ${e.message || JSON.stringify(e)}`);
				}
			},
			
			// 测试云函数
			testCloudFunction() {
				this.addLog('正在测试考试相关云函数...');
				uni.showLoading({
					title: '测试中...'
				});
				
				// 依次测试几个相关的云对象方法
				const functions = [
					{ service: 'exam-service', method: 'getExamList' },
					{ service: 'exam-service', method: 'getExamPaper' },
					{ service: 'exam-service', method: 'submitExam' }
				];
				let index = 0;
				
				const testNext = async () => {
					if (index >= functions.length) {
						uni.hideLoading();
						this.addLog('所有云对象测试完成');
						return;
					}
					
					const { service, method } = functions[index++];
					this.addLog(`正在测试云对象: ${service}.${method}`);
					
					try {
						const serviceObj = uniCloud.importObject(service);
						const res = await serviceObj[method]({ test: true });
						this.addLog(`${service}.${method} 测试结果: ${res.code === 0 ? '成功' : '失败'}`);
					} catch (err) {
						this.addLog(`${service}.${method} 测试失败: ${err.message || JSON.stringify(err)}`);
					}
					
							testNext();
				};
				
				testNext();
			},
			
			// 清除考试缓存
			clearExamCache() {
				try {
					uni.removeStorageSync('debug_exam_paper');
					uni.removeStorageSync('current_exam');
					uni.removeStorageSync('exam_answers');
					uni.removeStorageSync('exam_timer');
					this.addLog('考试缓存已清除');
				} catch (e) {
					this.addLog(`清除缓存失败: ${e.message || JSON.stringify(e)}`);
				}
			},
			
			// 跳转到考试页面
			navigateToExamPage() {
				uni.navigateTo({
					url: './exam-page',
					success: () => {
						this.addLog('已跳转到考试页面');
					},
					fail: (err) => {
						this.addLog(`跳转失败: ${err.message || JSON.stringify(err)}`);
					}
				});
			},
			
			// 跳转到结果页面
			navigateToExamResult() {
				uni.navigateTo({
					url: './exam-result?score=80&total=100&pass=60',
					success: () => {
						this.addLog('已跳转到结果页面');
					},
					fail: (err) => {
						this.addLog(`跳转失败: ${err.message || JSON.stringify(err)}`);
					}
				});
			},
			
			// 添加日志
			addLog(message) {
				const time = new Date().toLocaleTimeString();
				this.logs.push(`[${time}] ${message}`);
				// 保持最新的日志在可视区域
				this.$nextTick(() => {
					const logContainer = document.querySelector('.log-container');
					if (logContainer) {
						logContainer.scrollTop = logContainer.scrollHeight;
					}
				});
			},
			
			// 清除日志
			clearLogs() {
				this.logs = [];
				this.addLog('日志已清除');
			}
		}
	}
</script>

<style>
	.container {
		padding: 30rpx;
		width: 100%;
		box-sizing: border-box;
		background-color: #f5f5f5;
		min-height: 100vh;
	}
	
	.header {
		margin-bottom: 30rpx;
	}
	
	.title {
		font-size: 36rpx;
		font-weight: bold;
		color: #333;
		margin-bottom: 10rpx;
	}
	
	.subtitle {
		font-size: 28rpx;
		color: #666;
	}
	
	.debug-section {
		display: flex;
		flex-direction: column;
		gap: 30rpx;
	}
	
	.debug-card {
		background-color: #fff;
		border-radius: 12rpx;
		padding: 20rpx;
		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
	}
	
	.card-title {
		font-size: 30rpx;
		font-weight: bold;
		color: #333;
		padding-bottom: 20rpx;
		border-bottom: 1px solid #eee;
		margin-bottom: 20rpx;
	}
	
	.form-item {
		margin-bottom: 20rpx;
	}
	
	.form-label {
		font-size: 28rpx;
		color: #333;
		margin-bottom: 10rpx;
		display: block;
	}
	
	.form-input {
		background-color: #f8f8f8;
		padding: 15rpx;
		border-radius: 8rpx;
		width: 100%;
		box-sizing: border-box;
		font-size: 28rpx;
	}
	
	.debug-btn {
		background-color: #1BAE76;
		color: #fff;
		font-size: 28rpx;
		padding: 15rpx 0;
		margin-bottom: 20rpx;
	}
	
	.debug-btn:last-child {
		margin-bottom: 0;
	}
	
	.clear-log-btn {
		background-color: #FF5151;
	}
	
	.info-item {
		display: flex;
		margin-bottom: 15rpx;
	}
	
	.info-label {
		font-size: 28rpx;
		color: #666;
		width: 180rpx;
	}
	
	.info-value {
		font-size: 28rpx;
		color: #333;
		flex: 1;
	}
	
	.debug-logs {
		background-color: #fff;
		border-radius: 12rpx;
		padding: 20rpx;
		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
	}
	
	.log-container {
		background-color: #f0f0f0;
		border-radius: 8rpx;
		padding: 15rpx;
		max-height: 400rpx;
		margin-bottom: 20rpx;
	}
	
	.log-item {
		font-size: 24rpx;
		color: #333;
		display: block;
		margin-bottom: 10rpx;
		font-family: monospace;
	}
</style> 